{% extends 'mobile/base.html' %}

{% set headline = _('Read Message') %}
{% set title = headline %}

{% set styles = ('mobile-messages',) %}
{% set classes = 'read-message' %}

{% set return_url = url('messages.inbox') %}

{% block header_buttons %}
  {% if message.sender %}
    <div data-toggle-class="replying" class="icon-sprite" id="cancel-button">{{ _('Cancel') }}</div>
    <div data-toggle-class="replying" class="icon-sprite" id="reply-button">{{ _('Reply') }}</div>
    <div data-submit="reply-form" class="icon-sprite" id="send-button">{{ _('Send') }}</div>
  {% endif %}
{% endblock %}

{% block header %}
  <h1 class="read-title">{{ _('Read Message') }}</h1>
  <h1 class="reply-title">{{ _('Reply') }}</h1>
{% endblock %}

{% block content %}
  <div class="meta-bar">
    {{ _('From:') }}
    {% if message.sender -%}
      <a class="name-tag" href="{{ profile_url(message.sender) }}">{{ display_name(message.sender) }}</a>
    {%- else -%}
      {{ _('System') }}
    {%- endif %}
  </div>
  <div class="message-content">
    {{ message.content_parsed }}
  </div>
{% endblock %}

{% block after_main %}
  <div class="footer-overlay">
    <div class="half-width">
      <a class="trash-button icon-sprite" href="{{ url('messages.delete', message.id) }}">{{ _('Delete message') }}</a>
    </div>
    <div class="half-width">
      <form id="unread-form" action="{{ url('messages.bulk_action') }}" method="post">
        <input type="hidden" name="id" value="{{ message.id }}">
        {% csrf_token %}
      </form>
      <div data-submit="unread-form" data-name="mark_unread" class="mark-unread-button icon-sprite">{{ _('Mark unread') }}</div>
    </div>
  </div>
  {% if message.sender %}
    <form id="reply-form" action="{{ url('messages.new') }}" method="post">
      {% csrf_token %}
      {{ form.hidden_fields()|join }}
      <div class="meta-bar">
        {{ _('To:') }}
        <span class="name-tag">{{ display_name(message.sender) }}</span>
      </div>
      {{ form['message'] }}
    </form>
  {% endif %}
{% endblock %}
